<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
  <meta name="Generator" content="EditPlus®">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
  <title>Document</title>
 </head>
 <body>

  <style>
	li {
		float: left;
		width: 100px;
		border: 1px solid red;
	}

	.clearfix {
		/* display: baoth
				 both;
		 */
		 clear: both;
	}
  </style>

  
  <ul>
	<li> 元素1 </li>
	<li> 元素1 </li>
	<li> 元素1 </li>
	<li> 元素1 </li>

	<!-- 加一堵墙 -->
	<div class="clearfix"> </div>
  </ul>

  <ul>
	<li> 元素2 </li>
	<li> 元素2 </li>
	<li> 元素2 </li>
	<li> 元素2 </li>
  </ul>

 </body>
</html>
